<script>

import VisualizationOne from "@/views/visualIargeScreen/components/VisualizationOne.vue";
import VisualizationTwo from "@/views/visualIargeScreen/components/VisualizationTwo.vue";
import VisualizationThree from "@/views/visualIargeScreen/components/VisualizationThree.vue";
import VisualizationFour from "@/views/visualIargeScreen/components/VisualizationFour.vue";
import VisualizationFive from "@/views/visualIargeScreen/components/VisualizationFive.vue";
import VisualizationSix from "@/views/visualIargeScreen/components/VisualizationSix.vue";
import VisualizationSeven from "@/views/visualIargeScreen/components/VisualizationSeven.vue";
import VisualizationEight from "@/views/visualIargeScreen/components/VisualizationEight.vue";

export default {
  name: 'VisualIargeScreen',
  data() {
    return{
      gzName: ""
    }
  },
  mounted() {

  },
  methods: {

    open4(msg) {
      this.$notify.error({
        title: msg,
        message: '这是一条错误的提示消息'
      });
    },
  },
  components: {

    "VisualizationOne": VisualizationOne,
    "VisualizationTwo": VisualizationTwo,
    "VisualizationThree": VisualizationThree,
    "VisualizationFour": VisualizationFour,
    "VisualizationFive": VisualizationFive,
    "VisualizationSix": VisualizationSix,
    "VisualizationSeven": VisualizationSeven,
    "VisualizationEight": VisualizationEight,
  }
}
</script>

<template>
  <div id="vis-box">
    <div class="vis-box-div1">
      <div id="vis-box-main1">
        <VisualizationTwo></VisualizationTwo>
      </div>
      <div id="vis-box-main2">
      <VisualizationOne></VisualizationOne>
      </div>
      <div id="vis-box-main3">
        <VisualizationFive></VisualizationFive>
      </div>
    </div>
    <div class="vis-box-div2">
      <div id="vis-box-main4">
        <VisualizationFour></VisualizationFour>
      </div>
      <div id="vis-box-main5">
        <VisualizationSix></VisualizationSix>
      </div>
      <div id="vis-box-main6">
        <VisualizationThree></VisualizationThree>
      </div>
    </div>
    <div class="vis-box-div3">
      <div id="vis-box-main7">
        <VisualizationSeven></VisualizationSeven>
      </div>
      <div id="vis-box-main8">
        <VisualizationEight></VisualizationEight>
      </div>
    </div>
  </div>
</template>

<style scoped>
@import "css/VisualIargeScreen.css";
</style>